<%
layout("/layouts/platform.html"){
%>
    <header class="header navbar bg-white shadow">
		<div class="btn-group tool-button" style="padding:8px 0">
			<table>
           		<tbody>
           			<tr>
                  		<td>
                       		<input type="text" id="nameStr" name="nameStr" onclick="this.value=''" class="form-control" placeholder="名称" autofocus>
                        </td>
                        <td style="padding-left: 5px;">
                            <button id="searchBtn" type="button" class="btn btn-default"><i class="fa fa-search"></i>&nbsp;查询</button>
                      	</td>
                        </tr>
                    </tbody>
            </table>
		</div>
	    <div class="pull-right offscreen-right">
	         <a class="btn btn-default navbar-btn" href="${base}/platform/resource/add" data-toggle="modal" data-target="#addModal" ><i class="fa fa-plus"></i>&nbsp;新增</a>
		</div>
	</header>
    <div class="panel-body" style="padding-top: 70px;">
		<div class="box">
			<div class="box-body">
				<div class="col-sm-12">
					<div class="row">
				        <table class="table table-bordered table-hover mg-t datatable">
                <thead>
                <tr>
                    <th>图像</th>
                    <th>标题</th>
                    <th>简介</th>
                    <th>链接</th>
                    <th>排序</th>
                    <th>状态</th>
                    <th>操作</th>
       	        </table>
	    			</div>
				</div>
			</div>
		</div>
	</div>
<!-- 删除 -->
<div id="dialogDelete" class="modal fade bs-modal-sm" tabindex="-2" role="dialog" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title">删除数据</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-xs-12">
                        删除数据后无法恢复，确定删除吗？ <br/>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取 消</button>
                <button id="ok" type="button" class="btn btn-primary" data-loading-text="正在删除...">确 定</button>
            </div>
        </div>
    </div>
</div>
<!-- 修改-->
	<div id="editModal" class="modal fade bs-modal-sm"   tabindex="-3" role="dialog" aria-hidden="true">
	    <div id="editModalDialog" class="modal-dialog " >
	        <div class="modal-content">
	        
	        </div>
	    </div>
	</div>
	<!-- 新增-->
	<div id="addModal" class="modal fade bs-modal-sm"   tabindex="-3" role="dialog" aria-hidden="true">
	    <div id="addModalDialog" class="modal-dialog " >
	        <div class="modal-content">
	        
	        </div>
	    </div>
	</div>
<script language="JavaScript">
	var datatable;
	function initDatatable() {
	    datatable = $('.datatable').DataTable({
	        "dom": '<"toolbar">frtip',
	        "searching": false,
	        "processing": false,
	        "serverSide": true,
	        "select": true,
	        "ordering": false,
	        "language": {
	            "url": "${base}/assets/plugins/datatables/cn.json"
	        },
	        "preDrawCallback": function () {
	            sublime.showLoadingbar($(".main-content"));
	        },
	        "drawCallback": function () {
	            sublime.closeLoadingbar($(".main-content"));
	        },
	        "ajax": {
	            "url": "${base}/platform/resource/data",
	            "type": "post",
	            "data": function (d) {
	            	d.name = $('#nameStr').val();
	            }
	        },
	        "order": [[1, "desc"]],
	        "columns": [
				{"data": "img", "bSortable": true},
				{"data": "title", "bSortable": true},
				{"data": "remark", "bSortable": true},
				{"data": "link", "bSortable": true},
				{"data": "location", "bSortable": true},
				{"data": "state", "bSortable": true}
	        ],
	        "columnDefs": [
				{
					"render": function (data, type, row) {
						 return '<img src="${AppUploadRoot}'+data+'" width="25" height="25"> ';
			    	},
			   	 	"targets": 0
				},
	           	{
	           		"render": function (data, type, row) {
	                	if(data==0){
	                    	return "<font color='blue'>已启用</font>";
	                	}else if(data==1){
	                		return "<font color='red'>已禁用</font>";
	                	}
	                },
	                "targets": 5
	           	},
	            {
	                "render": function (data, type, row) {
	                	return '<div>'
						 + '<a class="btn btn-xs btn btn-default " href="${base}/platform/resource/edit/' + row.id + '" data-toggle="modal" data-target="#editModal"><i class="fa fa-edit"></i>&nbsp;修改</a> '
						 + '<a class="btn btn-xs btn btn-default " href="javascript:;" onclick="del(\''+ row.id+ '\')"><i class="glyphicon glyphicon-trash"></i>删除</a>'
						 + '</div>';
	                },
	                "targets": 6
	            }
	        ]
	    });
	    $("#searchBtn").on('click', function () {
	        datatable.ajax.reload();
	    });
	}
	function del(id) {
		
	    var dialog = $("#dialogDelete");
	    dialog.modal("show");
	    dialog.find("#ok").unbind("click");
	    dialog.find("#ok").bind("click", function (event) {
	        $.post("${base}/platform/resource/delete/" + id, {}, function (data) {
	            if (data.code == 0) {
	                datatable.ajax.reload(null,false);
	            } else {
	                Toast.error(data.msg);
	            }
	            dialog.modal("hide");
	        }, "json");
	    });
	}
	$(function () {
	    initDatatable();
	    $("#addModal").on("hidden.bs.modal", function () {
            $(this).removeData("bs.modal");
        });
		$("#editModal").on("hidden.bs.modal", function () {
            $(this).removeData("bs.modal");
        });
	});
</script>

<%}%>